import 'dart:math';

import 'package:flutter/material.dart';

class SliverWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    //一个滚动的列表对应一个sliver, 可以把很多sliver放在一个CustomScrollView中组合成视图。
    return CustomScrollView(
      //子widget 必须是：SliverList  SliverGrid  SliverSafeArea  SliverPadding  SliverAppBar   SliverFixedExtentList
      slivers: <Widget>[
        SliverAppBar(
          expandedHeight: 220,
          pinned: true,
          flexibleSpace: FlexibleSpaceBar(
            title: Text("title"),
            background: Image.asset(
              "assets/image/lyt.jpg",
              fit: BoxFit.cover,
            ),
          ),
        ),

//        SliverSafeArea(
        //沉浸式状态列表，刘海屏状态栏的对列表安全区域的适配
//          sliver:
        SliverList(
            delegate:
                SliverChildBuilderDelegate((BuildContext bctx, int index) {
          return Container(
            color: Colors.red,
            child: ListTile(
              title: Text("测试$index"),
              leading: Icon(Icons.person_outline),
              trailing: Icon(Icons.delete),
            ),
          );
        }, childCount: 4)),
//        ),
        //顶部会随着滚动
        SliverPadding(
          padding: EdgeInsets.all(8),
          sliver: SliverGrid(
              delegate:
                  SliverChildBuilderDelegate((BuildContext bctx, int index) {
                return Container(
                    color: Color.fromARGB(255, Random().nextInt(255),
                        Random().nextInt(255), Random().nextInt(255)));
              }, childCount: 50),
              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                  crossAxisCount: 2, crossAxisSpacing: 8, mainAxisSpacing: 8)),
        )
      ],
    );
  }
}
